import {Component, OnInit} from '@angular/core';
import {Store} from "@ngrx/store";
import {Observable} from "rxjs";
import {increment, decrement, reset} from '../store/actions/counter.actions';
import {Service} from "../service/service";
import {getList} from "../store/actions/list.actions";
import {listState} from "../store/reducers/list.reducers";
import {counterState} from "../store/reducers/counter.reducers";

@Component({
  selector: 'app-testA',
  templateUrl: './testA.component.html',
  styleUrls: ['./testA.component.less']
})
export class TestAComponent implements OnInit {
  public count$: Observable<counterState> | undefined;
  public list$: Observable<listState> | undefined;

  constructor(private store: Store<{ counter: counterState, list: listState }>, private service: Service) {
    this.count$ = store.select('counter');
    this.list$ = store.select('list');
    // this.list$ = this.store.select(state => {
    //   console.log('state',state)
    //   return state.list
    // });
    // this.list$.subscribe({
    //   next: x => console.log('got value ' + x),
    //   error: err => console.error('something wrong occurred: ' + err),
    //   complete: () => console.log('done'),
    // })
  }

  ngOnInit() {

  }

  increment() {
    this.store.dispatch(increment({num: 10}));
  }

  decrement() {
    this.store.dispatch(decrement({num: 10}));
  }

  reset() {
    this.store.dispatch(reset());
  }

  send() {
    this.store.dispatch(getList());
  }
}
